import Vue from 'vue'
import VueRouter from 'vue-router'
import Films from '../views/Films'
import Acticle from '../views/Acticle'
import center from '../views/center'
import MovieDetail from '../views/Films/MovieDetail.vue'
import articleDetail from '../views/Acticle/articleDetail.vue'
import NowPlaying from '../views/Films/children/NowPlaying.vue'
import comingSoon from '../views/Films/children/comingSoon.vue'
import city from '../components/city.vue'
Vue.use(VueRouter)

const routes = [{
    path: '/',
    redirect: '/films/NowPlaying'
  }, {
    path: '/films',
    name: 'Home',
    component: Films,
    redirect: '/films/NowPlaying',
    meta: {
      isNav: true
    },
    children: [{
      path: 'NowPlaying',
      component: NowPlaying,
      meta: {
        isNav: true
      },
    }, {
      path: 'comingSoon',
      component: comingSoon,
      meta: {
        isNav: true
      },
    }, ]
  },
  {
    path: '/article',
    name: 'About',
    component: Acticle,
    meta: {
      isNav: true
    }
  }, {
    path: '/center',
    name: 'center',
    component: center,
    meta: {
      isNav: true
    }
  }, {
    path: '/movie/:id',
    name: 'MovieDetail',
    component: MovieDetail,
  }, {
    path: '/articleDetail/:id',
    name: 'articleDetail',
    component: articleDetail
  }, {
    path: '/city',
    name: 'city',
    component: city
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router